<template>
  <div class="component work-header row between-span middle-span">
    <div class="row start-span middle-span">
      <span class="logo-font">美发沙龙管理系统</span>
    </div>
    <div class="row end-span middle-span">
      <work-notice></work-notice>
      <work-user></work-user>
    </div>
  </div>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import WorkUser from "~/components/workspace/work-user.vue";
import WorkNotice from '~/components/workspace/work-notice.vue';

@Component({
  components: {
    WorkUser,
    WorkNotice
  }
})
export default class WorkHeader extends Vue {
}
</script>

<style lang="less" scoped>
.component.work-header {
  @height :60px;

  flex-basis: 60px;
  height: @height;
  min-height: 60px;

  -moz-user-select: none; /*支持Firefox浏览器*/
  -webkit-user-select: none; /*支持Chrome，Opera，Safari等浏览器*/
  -ms-user-select: none; /*支持IE浏览器*/
  user-select: none;

  .logo-font {
    font-size: @height / 2;
    margin-left: 20px;
    color: #DAE0E6;
  }

  // .logo {
  //   padding: 10px;
  // }
}
</style>
